<template>
  <Card :bordered="false" dis-hover>
    <Tabs
      :animated="false"
      v-model="type"
      name="returnVisit"
      @on-click="clickTab"
    >
      <TabPane
        :label="`待回访（${totallist.next_callback}）`"
        name="0"
        tab="returnVisit"
      >
        <searchreturn
          ref="searchreturn0"
          @alltotallist="alltotallist"
          types="0"
        ></searchreturn>
      </TabPane>
      <TabPane
        :label="`已回访（${totallist.have_callback}）`"
        name="1"
        tab="returnVisit"
      >
        <searchreturn
          ref="searchreturn1"
          @alltotallist="alltotallist"
          types="1"
        ></searchreturn>
      </TabPane>
      <TabPane
        :label="`过期未访（${totallist.overdue_callback}）`"
        name="4"
        tab="returnVisit"
      >
        <searchreturn
          ref="searchreturn4"
          @alltotallist="alltotallist"
          types="4"
        ></searchreturn>
      </TabPane>
      <TabPane
        :label="`即将进入公海（${totallist.in_sea}）`"
        name="5"
        tab="returnVisit"
      >
        <searchreturn
          ref="searchreturn5"
          @alltotallist="alltotallist"
          types="5"
        ></searchreturn>
      </TabPane>
    </Tabs>
  </Card>
</template>
<script>
import searchreturn from "./searchreturn.vue";
export default {
  name: "returnVisit",
  components: { searchreturn },
  data() {
    return {
      totallist: {
        next_callback: 0,
        have_callback: 0,
        overdue_callback: 0,
        in_sea: 0,
      },
      type: "0",
    };
  },
  mounted() {
    this.type = (this.$route.query.type || 0) + "";
    this.$refs.searchreturn0.initials();
  },
  methods: {
    alltotallist(e) {
      switch (e.type) {
        case 0:
          this.totallist.next_callback = e.total;
          break;
        case 1:
          this.totallist.have_callback = e.total;
          break;
        case 4:
          this.totallist.overdue_callback = e.total;
          break;
        case 5:
          this.totallist.in_sea = e.total;
          break;
      }
    },
    clickTab(e) {
      switch (e) {
        case "0":
          this.$refs.searchreturn0.initials();
          break;
        case "1":
          this.$refs.searchreturn1.initials();
          break;
        case "4":
          this.$refs.searchreturn4.initials();
          break;
        case "5":
          this.$refs.searchreturn5.initials();
          break;
      }
    },
  },
};
</script>
